<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 坑一
        console.log(num);// undefined
        var num = 10
        // 相当于做了以下代码
        /* var num; //提升但是不赋值
        console.log(num);
        num = 10 */

        // 坑二
        fun()// 报错
        var fun = function() {
            console.log(22);
        }
        // 相当于执行了以下代码
       /*  var fun;
        fun()
        fun = function() {
            console.log(22);
        } */


        // 1. 我们js引擎运行js 分为两步:预解析 和 代码执行
        // (1) 预解析 js引擎会把js 会把var 和 function 提升到当前作用域的最前面
        // (2) 代码执行,按照代码的书写顺序从上往下执行
        // 2.预解析分为:变量预解析(变量提升) 和 函数预解析(函数提升)
        // (1) 变量提升: 就是把所有的变量声明提升到当前的作用域最前面 不提升赋值操作
        // (2) 函数提升: 就是把所有的函数声明提升到当前作用域的最前面 不提升调用

        // 案例分析
        f1();
        console.log(c); // 9
        console.log(b); //9
        console.log(a); // 报错Uncaught ReferenceError: a is not defined
        function f1() {
            var a = b = c= 9
            console.log(a); // 9
            console.log(b); // 9
            console.log(c); // 9
        }
        // => 9 9 9 9 9 报错

        // 以上代码相当于
/*         function f1() {
            var a=b=c=9 //相当于 var a=9;b=9;c=9;
                        //b和c直接赋值,没有var声明,直接当全局变量看
            console.log(a); 
            console.log(b);
            console.log(c);
        }
        f1();
        console.log(c);
        console.log(b);
        console.log(a); */
    </script>
</body>
</html>